<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>缤格</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/swiper.min.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../../css/binge.css" />
    <script type="text/javascript" src="../../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../../script/swiper.min.js"></script>
    <script type="text/javascript" src="../../script/mobile.js"></script>

    <script type="text/javascript">
        window['adaptive'].desinWidth = 750;
        window['adaptive'].baseFont = 28;
        window['adaptive'].maxWidth = 750;
        window['adaptive'].init();
    </script>
</head>

<body>
<!-- header -->
<div id="header" style="height: 0.9rem; background: #fff; position: fixed; top: 0;left: 0; width: 100%; z-index: 99">
    <div class="header" style="margin-bottom: 0;">
        <div class="head-back">
            <a href="javascript:void(0);" tapmode onclick="comeBack()" class="back-btn"></a>
        </div>
        <div class="head-title">
            <h6>发现圈子</h6>
        </div>
        <!--<div class="head-action">-->
            <!--<a href="javascript:void(0);" tapmode onclick="commonUrl('follow_school')" class="action-btn"></a>-->
        <!--</div>-->
    </div>
</div>
<!-- header end -->
<div class="header-h" style="padding-top: 1.5rem;"></div>
<!-- choose circle -->
<div class="choose-circle-kinds" id="main" style="padding-bottom: 1.4rem; padding-top: 0.2rem; flex-wrap: wrap;">
    <div class="choose-circle-list my-circle-list" style="width: 100%">
        <div class="common-title">
            <h6 style="font-size: 0.3rem;">热门</h6>
        </div>
        <ul id="hot">
            <!--<li class="circle-link" tapmode onclick="commonUrl('circle_index')">
                <div class="circle-img bg-cover" style="background: url('../../image/school-icon.png')"></div>
                <p class="multiline-ellipsis">娱乐娱乐娱</p>
            </li>-->

        </ul>
    </div>
    <div class="choose-circle-list my-circle-list" style="width: 100%">
        <div class="common-title">
            <h6 style="font-size: 0.3rem;">飙升</h6>
        </div>
        <ul id="biaosheng">
            <!--<li class="circle-link" tapmode onclick="commonUrl('circle_index')">
                <div class="circle-img bg-cover" style="background: url('../../image/school-icon.png')"></div>
                <p class="multiline-ellipsis">娱乐娱乐娱娱乐娱乐娱</p>
            </li>-->
        </ul>
    </div>
    <div class="choose-circle-list my-circle-list" style="width: 100%">
        <div class="common-title">
            <h6 style="font-size: 0.3rem;">新晋</h6>
        </div>
        <ul id="emerging">
            <!--<li class="circle-link" tapmode onclick="commonUrl('circle_index')">
                <div class="circle-img bg-cover" style="background: url('../../image/school-icon.png')"></div>
                <p class="multiline-ellipsis">娱乐娱乐娱</p>
            </li>-->

        </ul>
    </div>
</div>
<!-- choose circle end -->



</body>
</html>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript">
    apiready = function() {

        setFixStatusBar(); //设置状态栏
        pop.loading();

        keybackListener()
        /*//下拉刷新
        dropDownRefresh(function () {
            getMyCircleList(2);
        });*/
        getMyCircleList(2);
    }

    function getMyCircleList(type) {
        var param = {
            token: $api.getStorage('token'),
            type: type,//类型：1关注 2推荐
        }
        getAjax(Interface.circle_follows, param, function (res) {
            var hot = res.data.hot;
            var biaosheng = res.data.biaosheng;
            var emerging = res.data.emerging;

            if(isDefine(hot)){
                var hotHtml = '';
                //我关注的圈子列表
                for (var m = 0; m < hot.length; m++) {
                    var circle_id = {"circle_id": hot[m].id};
                    hotHtml += '<li class="circle-link" tapmode onclick=\'commonUrl("circle_index",'+jsonChange(circle_id)+')\'>' +
                        '                <div class="circle-img bg-cover" style="background: url('+ajaxUrl+hot[m].icon_path+')"></div>' +
                        '                <p class="multiline-ellipsis">'+hot[m].title+'</p>' +
                        '            </li>';
                }
                $("#hot").html(hotHtml);
            }else {
                $("#hot").html('<p style="width: 100%;" class="c-999 t-c">该类别暂无推荐圈子</p>');
            }

            if(isDefine(biaosheng)){
                var bstHtml = '';
                //我关注的圈子列表
                for (var k = 0; k < biaosheng.length; k++) {
                    var circle_id = {"circle_id": biaosheng[k].id};
                    bstHtml += '<li class="circle-link" tapmode onclick=\'commonUrl("circle_index",'+jsonChange(circle_id)+')\'>' +
                        '                <div class="circle-img bg-cover" style="background: url('+ajaxUrl+biaosheng[k].icon_path+')"></div>' +
                        '                <p class="multiline-ellipsis">'+biaosheng[k].title+'</p>' +
                        '            </li>';
                }
                $("#biaosheng").html(bstHtml);
            }else {
                $("#biaosheng").html('<p style="width: 100%;" class="c-999 t-c">该类别暂无推荐圈子</p>');
            }

            if(isDefine(emerging)){
                var egHtml = '';
                //我关注的圈子列表
                for (var n = 0; n < emerging.length; n++) {
                    var circle_id = {"circle_id": emerging[n].id};
                    egHtml += '<li class="circle-link" tapmode onclick=\'commonUrl("circle_index",'+jsonChange(circle_id)+')\'>' +
                        '                <div class="circle-img bg-cover" style="background: url('+ajaxUrl+emerging[n].icon_path+')"></div>' +
                        '                <p class="multiline-ellipsis">'+emerging[n].title+'</p>' +
                        '            </li>';
                }
                $("#emerging").html(egHtml);
            }else {
                $("#emerging").html('<p style="width: 100%;" class="c-999 t-c">该类别暂无推荐圈子</p>');
            }

            pop.close()
        },function (error) {
            $("#main").html(noData);
            pop.notice(error.msg)
            pop.close()
        })
    }



</script>
